{# on hérite du template de base #}

{% extends "::base.html.twig" %}

{% block stylesheets %}
    {{ parent() }}
    {% stylesheets 
        '@SmAssBundle/Resources/public/css/*.css' %}
        <link href="{{ asset_url }}" rel="stylesheet">
    {% endstylesheets %}
{% endblock stylesheets %}

{% block subtitle %} {{ ass.name }} {% endblock subtitle %}

{% block body %}

<div class="form-container">
{#% include 'SmAssBundle:Ass:form.srt.html.twig' %#}
</div>    
        
<div class="sous-titres">
    
    {% for srt in srts %}
    <div data-id="{{ srt.id }}" class="item item-srt">
        <div class="order">{{srt.line}}</div>
        <div class="start">{{srt.start}}</div>
        <div class="end">{{srt.end}}</div>
        <div class="style">{{srt.style}}</div>
        <div class="content">{{srt.content}}</div>
    </div>
    {% endfor %}
</div>
  
{% endblock %}

{% block javascripts %}
    {% javascripts 
        '@SmAssBundle/Resources/public/js/min/*'
        'js/min/masked.min.js' %}
        <script type="text/javascript" src="{{ asset_url }}"></script>
    {% endjavascripts %} 
    
    <script type="text/javascript">
        
        $(document).ready(function() {
            
            
            
            $('div.item-srt').click(function() {
       
                $('div.item-srt').css('background-color', '');
                $(this).css('background-color', 'yellow');
                
                $id = $(this).data('id');
                var route = '{{ path('sm_srt_form', {'id': "PLACEHOLDER" }) }}';
                route = route.replace("PLACEHOLDER", $id);
                
                $.post(route,{
                    type: "POST",
                    cache: false
                }, function(data){
                    $('.form-container').html(data.form);
                    resizeSousTitres();
                }); 
                
            });
        });
        
    </script>
    
{% endblock %}